/* Slide
.maincon.box
  padding: 0.75rem

// .slide .swiper-slide a
//   display: block
//   position: relative
//   line-height: 0

.slide .swiper-slide a span:last-child
  position: absolute
  bottom: 0
  left: 0
  display: block
  width: 100%
  background: #000
  opacity: 0.68
  color: #fff
  line-height: 1
  padding: 8px 0
  font-size: 1rem

.slide .swiper-slide a:hover
  border-bottom-color: transparent

.slide .swiper-slide a:hover span
  color: #ff84bb
  text-decoration: underline

/* .maincon >> .slide >> .gallery-left

.gallery-left .swiper-wrapper
  background: url(img/mc-line.png) 153px center no-repeat
  flex-direction: column
  padding-right: 45px

.gallery-left .swiper-slide
  height: auto
  line-height: 0

.gallery-left .swiper-slide-active
  background: url(img/mc-active.png) no-repeat

.gallery-left .slideimg
  max-width: 136px
  border-radius: 6px
  border: 2px solid transparent

.gallery-left .swiper-slide-active .slideimg
  border-radius: 4px
  border: 2px solid #ff85bc

.gallery-left .tempeture
  position: absolute
  top: 29px
  right: 21px
  width: 7px
  height: 363px
  overflow: hidden

.gallery-left .tempeture span
  background: #ffc9e1
  display: block
  position: absolute
  width: 100%
  height: 100%
  left: 0
  top: 0

.gallery-right img
  display: block

.gallery-right .swiper-slide a
  display: flex
  align-items: center
  justify-content: center
  width: 100%
  height: 100%
  background-color: #F8F8F8

@media screen and (min-width: 769px)
  .column.is-three-quarters.col-70
    width: 73%

  .column.is-one-quarter.col-30
    width: 27%

  .column.gallery-left
    flex: none

    // width: 23%

@media screen and (max-width: 1023px)
  body .container
    margin: 0 0.75rem

  .gallery-right img
    width: 100%
